
<%@page import="Persistencia.conexionBD"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Collection"%>
<%@page import="java.util.List"%>

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Documento sin t�tulo</title>
        <script type="text/JavaScript" src="scripts/jquery-1.7.1.min.js"></script>
        <style type="text/css">
            <!--
            body {
                font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
                background: #EDF7F8;
                margin: 0;
                padding: 0;
                color: #000;
            }

            /* ~~ Selectores de elemento/etiqueta ~~ */
            ul, ol, dl { /* Debido a las diferencias existentes entre los navegadores, es recomendable no a�adir relleno ni m�rgenes en las listas. Para lograr coherencia, puede especificar las cantidades deseadas aqu� o en los elementos de lista (LI, DT, DD) que contienen. Recuerde que lo que haga aqu� se aplicar� en cascada en la lista .nav, a no ser que escriba un selector m�s espec�fico. */
                padding: 0;
                margin: 0;
            }
            h1, h2, h3, h4, h5, h6, p {
                margin-top: 0;	 /* la eliminaci�n del margen superior resuelve un problema que origina que los m�rgenes escapen de la etiqueta div contenedora. El margen inferior restante lo mantendr� separado de los elementos de que le sigan. */
                padding-right: 15px;
                padding-left: 15px; /* la adici�n de relleno a los lados del elemento dentro de las divs, en lugar de en las divs propiamente dichas, elimina todas las matem�ticas de modelo de cuadro. Una div anidada con relleno lateral tambi�n puede usarse como m�todo alternativo. */
            }
            a img { /* este selector elimina el borde azul predeterminado que se muestra en algunos navegadores alrededor de una imagen cuando est� rodeada por un v�nculo */
                border: none;
            }

            /* ~~ La aplicaci�n de estilo a los v�nculos del sitio debe permanecer en este orden (incluido el grupo de selectores que crea el efecto hover -paso por encima-). ~~ */
            a:link {
                color:#414958;
                text-decoration: underline; /* a no ser que aplique estilos a los v�nculos para que tengan un aspecto muy exclusivo, es recomendable proporcionar subrayados para facilitar una identificaci�n visual r�pida */
            }
            a:visited {
                color: #4E5869;
                text-decoration: underline;
            }
            a:hover, a:active, a:focus { /* este grupo de selectores proporcionar� a un usuario que navegue mediante el teclado la misma experiencia de hover (paso por encima) que experimenta un usuario que emplea un rat�n. */
                text-decoration: none;
            }

            /* ~~ este contenedor rodea a todas las dem�s divs, lo que les asigna su anchura basada en porcentaje ~~ */
            .container {
                width: 100%;

                background: #EDF7F8;
                margin: 0 auto; /* el valor autom�tico de los lados, unido a la anchura, centra el dise�o. No es necesario si establece la anchura de .container en el 100%. */
            }

            /* ~~no se asigna una anchura al encabezado. Se extender� por toda la anchura del dise�o. Contiene un marcador de posici�n de imagen que debe sustituirse por su propio logotipo vinculado~~ */
            .header {
                background: #6F7D94;

            }

            /* ~~ Esta es la informaci�n de dise�o. ~~ 
            
            1) El relleno s�lo se sit�a en la parte superior y/o inferior de la div. Los elementos situados dentro de esta div tienen relleno a los lados. Esto le ahorra las "matem�ticas de modelo de cuadro". Recuerde que si a�ade relleno o borde lateral a la div propiamente dicha, �ste se a�adir� a la anchura que defina para crear la anchura *total*. Tambi�n puede optar por eliminar el relleno del elemento en la div y colocar una segunda div dentro de �sta sin anchura y el relleno necesario para el dise�o deseado.
            
            */
            .content {
                padding: 10px 0;
            }

            /* ~~ Este selector agrupado da espacio a las listas del �rea de .content ~~ */
            .content ul, .content ol { 
                padding: 0 15px 15px 40px; /* este relleno reproduce en espejo el relleno derecho de la regla de encabezados y de p�rrafo incluida m�s arriba. El relleno se ha colocado en la parte inferior para que el espacio existente entre otros elementos de la lista y a la izquierda cree la sangr�a. Estos pueden ajustarse como se desee. */
            }

            /* ~~ El pie de p�gina ~~ */
            .footer {
                padding: 10px 0;
                background: url(html/pieventana_medio.jpg);
            }

            /* ~~ clases float/clear varias ~~ */
            .fltrt {  /* esta clase puede utilizarse para que un elemento flote en la parte derecha de la p�gina. El elemento flotante debe preceder al elemento junto al que debe aparecer en la p�gina. */
                float: right;
                margin-left: 8px;
            }
            .fltlft { /* esta clase puede utilizarse para que un elemento flote en la parte izquierda de la p�gina. El elemento flotante debe preceder al elemento junto al que debe aparecer en la p�gina. */
                float: left;
                margin-right: 8px;
            }
            .clearfloat { /* esta clase puede situarse en una <br /> o div vac�a como elemento final tras la �ltima div flotante (dentro de #container) si #footer se elimina o se saca fuera de #container */
                clear:both;
                height:0;
                font-size: 1px;
                line-height: 0px;
            }
            .esquinaSuperiorIzquierdaTabla {
                background: url(html/tituloventana_left.jpg);	
            }
            .esquinaSuperiorDerechaTabla {
                background: url(html/tituloventana_right.jpg)	
            }
            .esquinaInferiorDerechaTabla {
                background:url(html/pieventana_right.jpg)
            }
            .esquinaInferiorIzquierdaTabla {
                background: url(html/pieventana_left.jpg)	
            }
            .cabezalTabla {
                background: url(html/tituloventana_medio.jpg)
            }
            .pieTabla {
                background: url(html/pieventana_medio.jpg)
            }
            .bordeDerechoTabla {
                background:url(html/derecha_tabla_light.jpg)
            }
            .bordeIzquierdoTabla {
                background:url(html/izquierda_tabla_light.jpg)
            }
            .SpecialButtons {
                background-image: url("html/fondoboton.gif");
                border-style: none;
                border-width: 0;
                color: #FFFFFF;
                font: bold 7.8pt "Verdana";
                height: 19px;
                letter-spacing: 1pt;
                margin: 3pt 3pt 3pt 0;
                padding: 0;
                text-decoration: none;
                text-indent: 0;
                vertical-align: bottom;
                width: 80px;
                border-radius: 5px 5px 5px 5px;
                color: white;
                font-family: Arial;
                font-size: 8pt;
                font-weight: bolder;
                height: 19px;
                text-align: center;
            }
            -->
        </style>

        <script language="javascript"> 
            $(document).ready(function() {
  
            });
 

 
        </script> 

    </head>

    <body>

        <div class="container">
            <div>
                <table  width="100%">
                    <tr>
                        <td style="background-image:url(html/fondo.jpg); width:100%">


                        </td>
                    </tr>
                </table>
            </div>

            <div class="content">
                <table  width="100%" border="0" align="center" cellspacing="0" cellpadding="0">
                    <tr>
                        <th width="3" height="27" class="esquinaSuperiorIzquierdaTabla" scope="col"></th>
                        <th width="457" class="cabezalTabla" scope="col">

                            <span id="span__TITULO_MPAGE" style="font-family:'Verdana'; font-size:10pt; font-weight:bold; font-style:normal; color:#FFFFFF; background:transparent">Reportes carga SIEC</span>

                        </th>
                        <th width="3" class="esquinaSuperiorDerechaTabla" scope="col"></th>
                    </tr>
                    <tr>
                        <td height="192" class="bordeIzquierdoTabla"></td>
                        <td>
                            <br/>
                            <br/>
                            <table width="72%" border="1" align="center">
                                <tr>
                                    <td width="377">
                                        <div class="content" id="contenido2">
                                            <FORM METHOD=POST ACTION= "Reporte.jsp">

                                                <strong>Seleccionar parametros</strong><br/><br/>                                    
                                                <%                                                
                                                    if (request.getParameter("informe").equals("1") || request.getParameter("informe").equals("2")) {
                                                %>
                                                <div class="content" id="comboAnios">                        
                                                    Anios:
                                                    <select name="Anio" id="Anio" style="width: 250px" >
                                                        <option selected>Seleccione el anio </option> 
                                                        <%
                                                            List<String> anio = (List<String>) conexionBD.obtenerAnios();
                                                            if (anio != null) {
                                                                for (int j = 0; j < anio.size(); j++) {%>
                                                        <option value="<%=anio.get(j)%>"><%=anio.get(j)%></option>
                                                        <%}
                                                            }%> 

                                                    </select>
                                                </div>

                                                <script type="text/javascript">
                                                    $("#comboAnios").hide();
                                                    $("#comboAnios").show("slow");
                                                </script>
                                                <%
                                                    if (request.getParameter("informe").equals("1")) {
                                                %>
                                                <div class="content" id="comboMeses">                        
                                                    Meses:
                                                    <select name="Mes" id="Mes" style="width: 250px" >
                                                        <option>Seleccione el mes</option> 
                                                        <%List<String> meses = (List<String>) conexionBD.obtenerMeses();
                                                            if (meses != null) {
                                                                for (int j = 0; j < meses.size(); j++) {%>
                                                        <option value="<%=meses.get(j)%>"><%=meses.get(j)%></option>
                                                        <%}
                                                            }%> 
                                                  </select>
                                              </div>

                                                <script type="text/javascript">
                                                    $("#comboMeses").hide();
                                                    $("#comboMeses").show("slow");
                                                </script>
                                          <%}
                                  }%>
                                                <div class="content" id="comboTipos">                        
                                                    Tipos:
                                                    <select name="Tipos" id="Tipos" style="width: 250px" >
                                                        <option>Seleccione el tipo</option> 
                                                        <%List<String> tipos = (List<String>) conexionBD.obtenerTipos();
                                                            if (tipos != null) {
                                                                for (int j = 0; j < tipos.size(); j++) {%>
                                                        <option value="<%=tipos.get(j)%>"><%=tipos.get(j)%></option>
                                                        <%}
                                                            }%> 
                                                    </select>
                                                </div>

                                                <script type="text/javascript">
                                                    $("#comboTipos").hide();
                                                    $("#comboTipos").show("slow");
                                                </script>
                                                <div class="content" id="comboInstituciones">                        
                                                    Instituciones
                                                    <select name="Instituciones" id="Instituciones" style="width: 250px" >
                                                        <option>Seleccione la institucion</option> 
                                                        <%List<String> instituciones = (List<String>) conexionBD.obtenerInstituciones();
                                                            if (instituciones != null) {
                                                                for (int j = 0; j < instituciones.size(); j++) {%>
                                                        <option value="<%=instituciones.get(j)%>"><%=instituciones.get(j)%></option>
                                                        <%}
                                                            }%>                                                             
                                                    </select>
                                                </div>

                                                <script type="text/javascript">
                                                    $("#comboInstituciones").hide();
                                                    $("#comboInstituciones").show("slow");
                                                </script>
                                                <input value="Filtrar" type=SUBMIT class="SpecialButtons">
                                                <input name="informe" type="text" value="<%=request.getParameter("informe")%>" style="visibility:hidden">
                                                <BR/>

                                            </FORM>
                                        </div>
                                        <script type="text/javascript">
                                            $("#contenido2").hide();
                                            $("#contenido2").show("slow");                                               
                                        </script>
                                    </td>
                                </tr>
                            </table>
                          <br/>
                            <br/>



                        </td>
                        <td class="bordeDerechoTabla"></td>
                    </tr>
                    <tr>
                        <td height="57" class="esquinaInferiorIzquierdaTabla"></td>
                        <td class="pieTabla"></td>
                        <td class="esquinaInferiorDerechaTabla"></td>
                    </tr>
                </table>

                <!-- end .container --></div>
        </div>
    </body>
</html>